﻿
@{
    ViewBag.Title = "设置颜色";
    Layout = "~/Areas/Admin/Views/Shared/_LayoutForm.cshtml";
}
<table class="table table-bordered">
    <tr>
        <td width="100">颜色</td>
        <td>图片</td>
        <td width="100"></td>
    </tr>
    @foreach (var color in ViewBag.Colors)
    {
        <tr>
            <td>@color.ColorName</td>
            <td>
                @foreach(var path in color.Images)
                {
                    <img src="@path" width="100" />

                }
            </td>
            <td>
                <input type="file" name="file" id="file" onchange="uploadImg(@color.Id)"  />
            </td>
        </tr>
    }
</table>

<form action="/admin/product/CreateColor" method="post">
    <span>颜色：</span>
    <input type="text" name="ColorName" />
    <input type="hidden" name="ProductInfoId" value="@ViewBag.InfoId" />
    <input type="submit" value="添加" />
</form>

@section scripts{
    <script>
        function uploadImg(id) {
            // 上传文件
                if ($('#file').val()) {
                    var formdata = new FormData();
                    formdata.append('file', $('#file')[0].files[0])
                    $.ajax({
                        url: '/upload',
                        type: 'post',
                        data: formdata,
                        contentType: false,
                        processData: false,
                        success: function (res) {
                            let path = res.data;// 返回的图片地址
                            // 插入数据
                            $.post('@Url.Action("CreateImage")', { path:path,colorid:id },
                                function (res) {
                                    if (res.success) {
                                        alert('上传完成')
                                        location.reload();  //刷新页面
                                    }
                             })
                        }
                    })
                } else {
                    alert('请选择文件')
                }
        }
        $(function () {

        })

    </script>
    
    }
                



